import {markRaw} from "vue"
import {BaseProperties, BaseEvents, BaseMethodList} from "../BaseVjsonComponent"
import defineVjsonComponent from "../../../runtime/DefineVjsonComponent"
import {Toolbar} from "../../Defaults"
import YvDesignTree from "./YvDesignTree.vue"
import YvVjsonTree from "./YvVjsonTree.vue"

export default defineVjsonComponent('tree', {
    defaults: Toolbar,
    designer: 'YvDesignTree',
    runtime: 'YvVjsonTree',
    install(Vue) {
        Vue.component('YvDesignTree', YvDesignTree)
        Vue.component('YvVjsonTree', YvVjsonTree)
    },
    Toolbox: [
        {category: 'advanced', order: 1, icon: 'icon-wenjianshu', dragGroup: "rowGroup"},
    ],
    properties: {
        ...BaseProperties,
        autoLoad: {order: 1, desc: '自动载入数据', editor: 'switch', bindable: false, category: 'other'},
        enableFilter: {order: 2, desc: '启用过滤', editor: 'switch', bindable: false, category: 'other'},
        enableRefresh: {order: 3, desc: '刷新按钮', editor: 'switch', bindable: false, category: 'other',},
        enableExpandedAll: {order: 4, desc: '展开按钮', editor: 'switch', bindable: false, category: 'other'},
        checkbox: {order: 5, desc: '选择框', editor: 'switch', bindable: false, category: 'other'},
        checkStrictly: {order: 6, desc: '级联选择', editor: 'switch', bindable: false, category: 'other'},
        expandOnClickNode: {order: 7, desc: '点击展开', editor: 'switch', bindable: false, category: 'other',},
        keepExpandKeys: {order: 8, desc: '维持展开状态', editor: 'switch', bindable: false, category: 'other',},
        checkOnClickNode: {order: 9, desc: '点击选中', editor: 'switch', bindable: false, category: 'other',},
        autoExpandParent: {order: 10, desc: '自动展开父节点', editor: 'switch', bindable: false, category: 'other',},
        isCard: {order: 11, desc: '是否是卡片', editor: 'switch', bindable: false, category: 'other'},
        borderArr: {order: 7, desc: '边线', editor: 'border', bindable: true, category: 'other'},
    },
    events: {
        ...BaseEvents,
        onDataLoadComplete: {order: 1, desc: '数据源刷新后触发'},
        onDataLoadBefore: {order: 1, desc: '数据源刷新前触发'},
        click: {order: 1, desc: '点击时触发'},
        nodeClick: {order: 1, desc: '当节点被点击的时候触发'},
        check: {order: 1, desc: '点击节点复选框之后触发'},
        currentChange: {order: 1, desc: '当前选中节点变化时触发的事件'},
        nodeExpand: {order: 1, desc: '节点被展开时触发的事件'},
        nodeCollapse: {order: 1, desc: '节点被关闭时触发的事件'},
        nodeDragStart: {order: 1, desc: '节点开始拖拽时触发的事件'},
        nodeDragEnter: {order: 1, desc: '拖拽进入其他节点时触发的事件'},
        nodeDragLeave: {order: 1, desc: '拖拽离开某个节点时触发的事件'},
        nodeDragOver: {order: 1, desc: '在拖拽节点时触发的事件（类似浏览器的 mouseover 事件）'},
        nodeDragEnd: {order: 1, desc: '拖拽结束时（可能未成功）触发的事件'},
        nodeDrag: {order: 1, desc: '拖拽成功完成时触发的事件'},
    },
    methodList: {
        ...BaseMethodList,
        performClick: {order: 1, desc: '点击后触发', category: 'basic'}
    }
})